<!--
 * @Author: wangkg wangkegui@longfor.com
 * @Date: 2024-05-08 15:56:35
 * @Description: 
-->
<template>
  <el-icon @click="switchCollapsed">
    <DArrowLeft v-if="!isCollapsed" />
    <DArrowRight v-else />
  </el-icon>
</template>

<script lang="ts" setup>
  import { computed } from 'vue'
  import { DArrowRight, DArrowLeft } from '@element-plus/icons-vue';
  import { useAppStore } from '@/store/modules/app';

  const isCollapsed = computed(() => appStore.getMenuSetting.collapsed);
  const appStore = useAppStore();
  const switchCollapsed = () => {
    const config = {
      menuSetting: {
        collapsed: !isCollapsed.value,
      },
    };
    appStore.setProjectConfig(config);
  };
</script>
